import React from 'react';
import styled from 'styled-components';
import Label from 'components/Basic/Label';
import Description from 'components/Basic/Description';
import HighLighter from 'components/Basic/HighLighter';
import Parameter from 'components/Basic/Parameter';
import { ParameterSection } from 'components/Basic/Section';

const DelegateWrapper = styled.div`
  margin-bottom: 50px;
`;

function Delegate() {
  const formula = `  const venus = new Venus(window.ethereum);

  (async function() {
    const delegateTx = await venus.delegate('0xa0df350d2637096571F7A701CBc1C5fdE30dF76A');
    console.log('Ethers.js transaction object', delegateTx);
  })().catch(console.error);`;

  return (
    <DelegateWrapper id="venusJS-delegate">
      <Label title marginBottom>
        Delegate
      </Label>
      <Description>
        (string) The address in which to delegate voting rights to.
      </Description>
      <ParameterSection>
        <Parameter name="_address">
          {` (object) A JavaScript object of API request parameters.`}
        </Parameter>
        <Parameter name="[options]">
          {` (CallOptions) Options to set for eth_call, optional ABI (as JSON object), and Ethers.js method overrides. The ABI can be a string of the single intended method, an array of many methods, or a JSON object of the ABI generated by a Solidity compiler.`}
        </Parameter>
        <Parameter name="RETURN">
          {` (object) Returns an Ethers.js transaction object of the vote transaction.`}
        </Parameter>
      </ParameterSection>
      <HighLighter>{formula}</HighLighter>
    </DelegateWrapper>
  );
}

export default Delegate;
